// pages/material/material.js
import regeneratorRuntime from '../../utils/wxPromise.min.js'
const ctx = wx.createCanvasContext('runCanvas');
const ctx1 = wx.createCanvasContext('runCanvas1');
const ctx2 = wx.createCanvasContext('runCanvas2');
const ctx3 = wx.createCanvasContext('runCanvas3');
Page({

  /**
   * 页面的初始数据
   */
  data: {
    scorllLeft: -210,
    navArr: ['生产', '检测', '入库', '省公司入库', '报料', '出库'],
    currentIndex: 0,
    operationFlag: false,
    IAP: '',
    currentNavId: 0,
    page: 1,
    limit: 10  ,
    for_list:[{
      icon:'icon1',
      url:'../match/match',
      title:'匹配'
    }, {
        icon: 'icon2',
        url: '../produce/produce',
        title: '生产'
      }, {
        icon: 'icon3',
        url: '/pages/detection/detection',
        title: '检测'
      }, {
        icon: 'icon4',
        url: '/pages/storage/storage',
        title: '入库'
      }, {
        icon: 'icon5',
        url: '/pages/report/report',
        title: '报料'
      }, {
        icon: 'icon6',
        url: '/pages/out/out',
        title: '出库'
      }]
  },
  getAddress() {
    var IAP = getApp().globalData.host;
    console.log(IAP)
    this.setData({
      IAP: IAP
    })
  },
  // 根据施工状态获取工程信息
  getEngineeringInfo() {
    return new Promise((resolve, reject) => {
      wx.request({
        url: this.data.IAP + 'project/index',
        data: {
          page: this.data.page,
          limit: this.data.limit,
          status: this.data.currentNavId,
        },
        header: {
          "token": wx.getStorageSync('token')
        },
        success: res => {
          if (res.data.code == 0) {
            if (this.data.page == 1) {
              this.setData({
                map: res.data.map,
                engineeringList: res.data.map.page.list,
                page: this.data.page + 1,
              })
              resolve(res.data.map.complete);
            } else {
              this.setData({
                map: res.data.map,
                engineeringList: this.data.engineeringList.concat(res.data.map.page.list),
                page: this.data.page + 1
              })
              resolve(res.data.map.complete);
            }
          } else {
            wx.showToast({
              title: res.data.msg,
              icon: 'none'
            })
          }
        }
      })

    });

  },
  // canvas画环装图
  run(c, w, h,color,x) { //c是圆环进度百分比   w，h是圆心的坐标
    let that = this;
    var num = (2 * Math.PI / 100 * c) - 0.5 * Math.PI;
    var lineWidth = wx.getSystemInfoSync().windowWidth / 750 * 15
    //圆环的绘制
    x.arc(w, h, w - lineWidth / 2, -0.5 * Math.PI, num); //绘制的动作
    x.setStrokeStyle(color); //圆环线条的颜色
    x.setLineWidth(lineWidth); //圆环的粗细
    x.setLineCap("round"); //圆环结束断点的样式  butt为平直边缘 round为圆形线帽  square为正方形线帽
    x.stroke();
    //开始绘制百分比数字
    x.beginPath();
    x.setFontSize(13); // 字体大小 注意不要加引号
    x.setFillStyle("#ffb530"); // 字体颜色
    x.setTextAlign("center"); // 字体位置
    x.setTextBaseline("middle"); // 字体对齐方式
    x.fillText(c + "%", w, (h +2)); // 文字内容和文字坐标
    x.draw();
  },
  //canvas
  canvasRun(completeC,color,canvasID,x) {
    console.log(completeC)
    wx.createSelectorQuery().select('#' + canvasID).boundingClientRect((rect) => {
      //监听canvas的宽高
      var w = parseInt(rect.width / 2); //获取canvas宽的的一半
      var h = parseInt(rect.height / 2); //获取canvas高的一半
      var c = completeC ? this.data.map.complete : 0
      this.run(c, w, h, color,x)
    }).exec();
  },

  async getEngineering() {
    // await this.getEngineeringInfo();
    const c = await this.getEngineeringInfo();
    await this.canvasRun(c, '#35d0ba',"runCanvas",ctx)
    await this.canvasRun(c, '#ff8630', "runCanvas1", ctx1)
    await this.canvasRun(c, '#ffd730', "runCanvas2", ctx2)
    await this.canvasRun(c, '#448aff', "runCanvas3", ctx3)
  },

  // 点击取消操作
  cancelOperation(e) {
    this.setData({
      operationFlag: false
    })
  },
  // 点击催单操作
  reminderOperation(e){},
  // 点击完成操作
  completeOperation(e){},
  // 选择材料的状态
  chooseNav(e) {
    if (this.data.currentIndex == e.currentTarget.dataset.idx) {
      return;
    } else {
      this.setData({
        currentIndex: e.currentTarget.dataset.idx,
        scorllLeft: 210 * e.currentTarget.dataset.idx - 210
      })
    }
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    this.getAddress();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {
    this.getEngineering();
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function() {

  }
})